<template>
  <ul class="lFooter">
    <li v-if="dayAndNight" @click="cssType(1)">
      <i class="iconfont icon-yueliang noClick"></i>
      <span>夜间模式</span>
    </li>
    <li v-else @click="cssType(2)">
      <i class="iconfont icon-taiyang noClick iconte"></i>
      <span>日间模式</span>
    </li>
    <li>
      <i class="iconfont icon-shezhi noClick"></i>
      <span>设置</span>
    </li>
  </ul>
</template>

<script>
import {mapState, mapActions} from 'vuex';
export default {
  data: function() {
    return {
    };
  },
  computed: {
    ...mapState('login',['dayAndNight'])
  },
  methods: {
    ...mapActions('login',['set_change_dayAndNight']),
    cssType (num) {
      this.set_change_dayAndNight(num)
    }
  }
};
</script>

<style lang="scss" scoped>
.lFooter {
  padding-bottom: 0.4rem;
  display: flex;
  justify-content: space-around;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  li {
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content: center;
    i {
      font-size: 0.3rem;
    }
    .iconte {
      font-weight: 700;
    }
    span {
      font-size: 0.1rem;
      text-align: center;
    }
  }
}
</style>